<template>
    <div class="goodsdesc-container">
        <h3>{{info.title}}商品图文介绍</h3>
        <hr>
        <div class="content">
          <img v-for="(item) in info.contentSrc" :src="item.src" :key="item.src">
        </div>      
    </div>
</template>

<script>
export default {
  data() {
    return {
      info: {
        //图文数据
        title: "小米8 青春版 4GB+64GB",
        contentSrc: [
          {
            src: require("../../images/GoodDesc01.jpg")
          },
          {
            src: require("../../images/GoodDesc02.jpg")
          },
          {
            src: require("../../images/GoodDesc03.jpg")
          },
          {
            src: require("../../images/GoodDesc04.jpg")
          },
          {
            src: require("../../images/GoodDesc05.jpg")
          },
          {
            src: require("../../images/GoodDesc06.jpg")
          },
          {
            src: require("../../images/GoodDesc07.jpg")
          },
          {
            src: require("../../images/GoodDesc08.jpg")
          },
          {
            src: require("../../images/GoodDesc09.jpg")
          },
          {
            src: require("../../images/GoodDesc10.jpg")
          },
          {
            src: require("../../images/GoodDesc11.jpg")
          },
          {
            src: require("../../images/GoodDesc12.jpg")
          },
          {
            src: require("../../images/GoodDesc13.jpg")
          }
        ]
      }
    };
  },
  created() {
    this.getGoodsDesc();
  },
  methods: {
    getGoodsDesc() {
      // this.$http
      //   .get("api/goods/getdesc/" + this.$route.params.id)
      //   .then(result => {
      //     if (result.body.status === 0) {
      //       this.info = result.body.message[0];
      //     }
      //   });
    }
  }
};
</script>

<style lang="scss">
.goodsdesc-container {
  padding: 0 4px;
  h3 {
    font-size: 16px;
    color: #226aff;
    text-align: center;
    margin: 15px 0;
  }
  .content {
    line-height:0;
    img {
      width: 100%;
      padding: 0;
      margin: 0;
      vertical-align: middle;
    }
  }
}
</style>
